<template>
<div id="box">
  <van-nav-bar
  left-text="返回"
  title="注册"
  left-arrow
   @click-left="onClickLeft"
/>
<img src="../assets/logo1.png" id="logo1" >

<van-cell-group>
 <van-field
  left-icon="graphic" 
    v-model="phone"
    label="手机号"
    placeholder="请输入手机号"
    error-message="手机号格式错误"
  />
  <van-field class="hangjian"
   left-icon="youzan-shield"
    v-model="sms"
    center
    clearable
    label="短信验证码"
    placeholder="请输入短信验证码"
  >
     <van-button slot="button" size="small" type="primary">发送验证码</van-button>
 </van-field>

  <van-field
   left-icon="bag-o"
    v-model="password"
    type="password"
    label="密码"
    placeholder="请输入密码"
    required
  />

    
 
</van-cell-group>
<van-button type="primary" size="large">登录</van-button>

<span>点击"注册"表明已经同意</span><span class="zhuce">《熊猫用户APP协议》</span>

</div>
</template>

<script>
export default {
  name: "register",
  data(){
    return{
      phone:"",
       sms:"",
       password:"",
    }
  },
  methods: {
    zhuce(){
      this.$router.push('/register')
    },
    onClickLeft() {
      this.$router.go(-1)
    },
  }
}
</script>

<style scoped lang="scss">
     #box{
         padding: 0 10px
    }
    #logo1{
      width: 30%;;
      height: 30%;
      margin-left:35%;
      margin-top: 10%;
      color: red;
    }
    .zhuce{
      color: aqua;
    }
   

</style>
